<template>
  <div class=''>
      <el-form :model="form" v-if="ishow" label-width="110px" ref="formRef" :rules="rules">
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="离开时间">
              <el-date-picker
                    v-model="form.factOutdate"
                    type="datetime"
                    placeholder="请选择离开时间"
                    value-format="YYYY-MM-DD HH:mm:ss"
                    style="width:100%"
                />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="房间是否安全">
              <el-radio-group v-model="form.roomIsSafe">
                  <el-radio-button
                      v-for="item in sys_yes_no"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                  />
                  <!--  -->
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24" class="mb-5">
            <el-form-item label="去向" prop="userWhereabouts" required>
              <el-input v-model="form.userWhereabouts" placeholder="请输入去向"/>
            </el-form-item>
          </el-col>
          <el-col :span="21">
          </el-col>
          <el-col :span="3">
            <el-button type="primary" @click="submitHandle">保存</el-button>
          </el-col>
        </el-row>
        
      </el-form>
  </div>
</template>
<script setup>
import {getCurrentInstance, onMounted} from "vue";
const {proxy} = getCurrentInstance()
import {ApplyDetailInfo,ApplyDetailgetOut} from "@/api/ApplyDetail/ApplyDetail";
import { getPoliceAreaInfo } from "@/api/PoliceAreaManage/PoliceAreaManage";
const {sys_yes_no} = proxy.useDict('sys_yes_no')

const props = defineProps({
data: {
  type: Object,
  required: true, // 如果这个属性是必需的
},
})
const ishow = ref(false)
const form = ref({
  jwApplyDetailId:'1111',          //办案区使用申请单子表ID
  roomIsSafe:'0'
})
const rules = {
  userWhereabouts: [{ required: true, message: "人员去向不能为空", trigger: "blur" }],
}
// 通知事件
const emit = defineEmits(['updataList'])

onMounted(() => {
  nextTick(() => {
    ishow.value = true
  })
  if (props.data && props.data.jw_applydetail_id) {
    // 调用接口获取详细数据
    getApplyDetailInfo(props.data.jw_applydetail_id);
  }
})
// 获取详情
const getApplyDetailInfo = async () => {
    await ApplyDetailInfo(props.data.jw_applydetail_id).then(res => {
      form.value = res.data
    })
}

/** 提交按钮 */
function submitHandle() {
  proxy.$refs["formRef"].validate(valid => {
    if (valid) {
      const subdata = {
        jwApplyDetailId:form.value.jwApplydetailId,
        factOutDate:form.value.factOutdate,
        userWhereAbouts:form.value.userWhereabouts,
        roomIsSafe:form.value.roomIsSafe,
      }
      ApplyDetailgetOut(subdata).then(res => {
        proxy.$modal.msgSuccess(`保存成功`)
        getApplyDetailInfo(form.value.jwApplydetailId);
          emit('updataList', 'fromcomeIn',"来了老弟")
      })
    }
  });
}
</script>